<!--
 * @Author: y001554
 * @Date: 2023-01-16 20:11:08
 * @LastEditors: y001554
 * @LastEditTime: 2023-09-09 14:44:49
 * @FilePath: \ylwl\src\demos\inDialog.vue
 * @Description: 
 * 
 * Copyright (c) 2023 by FE/ylwl, All Rights Reserved. 
-->

<template>
  <div class="inlineBox">
    <h3>弹窗嵌套内容</h3>
    <el-button type="primary" @click="testShow">弹窗再来一个</el-button>
    <el-button type="primary" @click="closeAll">全部关闭</el-button>
  </div>
</template>
<script setup lang="ts">
import {
  ref,
  reactive,
  Ref,
  h,
  getCurrentInstance,
  render
  // onMounted
} from 'vue'
import InDialog2 from './inDialog2.vue'
import { MpDialog } from '../../packages/plugins/index'
import { onMounted } from 'vue'
const props = defineProps({
  nameKey: {
    type: String,
    default: '123'
  }
})
onMounted(() => {
  // alert(props.nameKey)
})
const closeAll = () => {
  MpDialog.closeAll()
}
const loading = ref<boolean>(false)
const testShow = () => {
  MpDialog.show({
    title: '第2个弹窗的标题',
    id: 'testShow222',
    content: InDialog2,
    props: {},
    dialogProps: {
      width: '800px',
      top: '30px'
    },
    showConfirm: false
  })
}
const onSure = (next: (e: boolean, data: any) => void) => {
  loading.value = true
  setTimeout(() => {
    // alert(2)
    loading.value = false
    next(false, { name: '额外参数' })
  }, 3000)
}
defineExpose({ onSure })
</script>
<style scoped lang="scss">
.inlineBox {
  width: 100%;
  height: 60vh;
  box-sizing: border-box;
}
</style>
